{extend name="/index/base" /}

{block name="content"}
<style>
    .cate-box{margin-bottom: 15px;padding-bottom:10px;border-bottom: 1px solid #f0f0f0}
    .cate-box dt{margin-bottom: 10px;}
    .cate-box dt .cate-first{padding:10px 20px}
    .cate-box dd{padding:0 50px}
    .cate-box dd .cate-second{margin-bottom: 10px}
    .cate-box dd .cate-third{padding:0 40px;margin-bottom: 10px}
</style>
<div class="layui-card">
    <div class="layui-card-header layuiadmin-card-header-auto">
        <h2>角色 【{$role['title']}】分配权限</h2>
    </div>
    <div class="layui-card-body">
        <form action="" method="post" class="layui-form">

            {foreach $nodes as $key=>$vo}
            <dl class="cate-box">
                <dt>
                    <div class="cate-first"><input id="{$vo.new_node}" type="checkbox" name="nodes[]" value="{$vo.node}"  {if in_array($vo.node, $is_chose)} checked="checked" {/if} lay-skin="primary" title="{$vo.title?$vo.title:$vo.node}" /></div>
                </dt>
                {foreach $vo['_sub_'] as $key1=>$vo1}
                <dd>
                    <div class="cate-second"><input type="checkbox"  id="{$vo.new_node}-{$vo1.new_node}" name="nodes[]" value="{$vo1.node}" {if in_array($vo1.node, $is_chose)} checked="checked" {/if} lay-skin="primary" title="{$vo1.title?$vo1.title:$vo1.node}" /></div>
                    <div class="cate-third">
                        {foreach $vo1['_sub_'] as $key2=>$vo2}
                        <input type="checkbox" id="{$vo.new_node}-{$vo1.new_node}-{$vo2.new_node}" name="nodes[]" value="{$vo2.node}" {if in_array($vo2.node, $is_chose)} checked="checked" {/if} lay-skin="primary" title="{$vo2.title?$vo2.title:$vo2.node}" />
                        {/foreach}
                    </div>
                </dd>
                {/foreach}
            </dl>
            {/foreach}
            <div class="layui-form-item">
                <button class="layui-btn" type='submit'>保 存</button>
                <a href="{:URL('admin/auth/index')}"  class="layui-btn" >返 回</a>
            </div>

        </form>
    </div>
</div>

{/block}


{block name="script"}
<script>
    layui.use(['layer','table','form'],function () {
        var layer = layui.layer;
        var form = layui.form;
        var table = layui.table;
        var $ = layui.$ //由于layer弹层依赖jQuery，所以可以直接得到


        form.on('checkbox', function (data) {
            var check = data.elem.checked;//是否选中
            var checkId = data.elem.id;//当前操作的选项框
            if (check) {
                //选中
                var ids = checkId.split("-");
                if (ids.length == 3) {
                    //第三极菜单
                    //第三极菜单选中,则他的上级选中
                    $("#" + (ids[0] + '-' + ids[1])).prop("checked", true);
                    $("#" + (ids[0])).prop("checked", true);
                } else if (ids.length == 2) {
                    //第二季菜单
                    $("#" + (ids[0])).prop("checked", true);
                    $("input[id*=" + ids[0] + '-' + ids[1] + "]").each(function (i, ele) {
                        $(ele).prop("checked", true);
                    });
                } else {
                    //第一季菜单不需要做处理
                    $("input[id*=" + ids[0] + "-]").each(function (i, ele) {
                        $(ele).prop("checked", true);
                    });
                }
            } else {
                //取消选中
                var ids = checkId.split("-");
                if (ids.length == 2) {
                    //第二极菜单
                    $("input[id*=" + ids[0] + '-' + ids[1] + "]").each(function (i, ele) {
                        $(ele).prop("checked", false);
                    });
                } else if (ids.length == 1) {
                    $("input[id*=" + ids[0] + "-]").each(function (i, ele) {
                        $(ele).prop("checked", false);
                    });
                }
            }
            form.render();
        });


        //搜索
        $('#submit').click(function () {
            var title = $(".title").val()
            var desc = $(".desc").val();

            var data = {'title':title,'desc':desc};

            $.ajax({
                type: 'POST',
                url: '{:url("admin/auth/store")}',
                data: data,
                success: function (ret) {
                    if (ret.code == 200) {
                        layer.msg(ret.msg, {icon: 6, time: 1000}, function () {
                            window.location.href='{:url("admin/auth/index")}';
                        });
                    }
                    return false;
                }
            });
        })


    })
</script>
{/block}
